import React from "react"
import './style.less'
import { Link } from 'react-router-dom'

export default class LifePayMoreComponent extends React.Component{
  render(){
    return(
      <div className='life-pay-more'>
        {/*生活缴费中部*/}
        <div className='new-pay'>
          <h2 className='clear'>
            <span>新增缴费</span>
            <span>
              <i className="iconfont icon-weizhi2"></i>
              城市
            </span>
          </h2>
          <ul className='lifepay-type clear'>
            <li>
              <i className="iconfont icon-shuifei"></i>
              <br/>
              <span>水费</span>
            </li>
            <li>
              <Link to='/lifeTypeOne/电费'>
                <i className="iconfont icon-dianfei"></i>
                <br/>
                <span>电费</span>
              </Link>
            </li>
            <li>
              <Link to='/lifeTypeOne/燃气费'>
                <i className="iconfont icon-ranqifei"></i>
                <br/>
                <span>燃气费</span>
              </Link>
            </li>
            <li>
              <Link to='/lifeTypeTwo/宽带'>
                <i className="iconfont icon-kuandai"></i>
                <br/>
                <span>宽带</span>
              </Link>
            </li>
            <li>
              <Link to='/lifeTypeTwo/暖气费'>
                <i className="iconfont icon-taiyang"></i>
                <br/>
                <span>暖气费</span>
              </Link>
            </li>
            <li>
              <Link to='/lifeTypeOne/有线电视'>
                <i className="iconfont icon-youxiandianshi"></i>
                <br/>
                <span>有线电视</span>
              </Link>
            </li>
          </ul>
        </div>
        {/*生活缴费底部*/}
        <div className='pay-footer'>
          <p>
            <span>缴费代扣</span>|
            <span>户号管理</span>|
            <span>帮助中心</span>
          </p>
        </div>
      </div>
    )
  }
}
